<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<title>Meus Concursos</title>
	<link rel="stylesheet" type="text/css"
		href="#{facesContext.externalContext.requestContextPath}/public/css/style.css" />
	<link rel="stylesheet" type="text/css"
		href="#{facesContext.externalContext.requestContextPath}/public/css/primefaces-bootstrap.css" />
	<h:outputScript>$ = jQuery;</h:outputScript>

	<script type="text/javascript">
   	$(document).ready(function() {
	   $("a#mostrar").toggle(
		   function() {
			   $("div#oculto").fadeIn(); // ou slideDown()
			   $("div#oculto2").fadeIn();
			   $("div#oculto3").fadeIn();
			   $("div#oculto4").fadeIn();
			   $("div#oculto5").fadeIn();
			   $("div#oculto6").fadeIn();
			   $("div#oculto7").fadeIn();
			   $("div#oculto8").fadeIn();
			   $("a#mostrar").text("[-] Remover dados adicionais");
		   },
		   function() {
			   $("div#oculto").fadeOut(); // ou slideUp()
			   $("div#oculto2").fadeOut();
			   $("div#oculto3").fadeOut();
			   $("div#oculto4").fadeOut();
			   $("div#oculto5").fadeOut();
			   $("div#oculto6").fadeOut();
			   $("div#oculto7").fadeOut();
			   $("div#oculto8").fadeOut();
			   $("a#mostrar").text("[+] Adicionar dados adicionais");
		   }
	   );
   	});
   	</script>

	<script type="text/javascript">
   	$(document).ready(function() {
	   $("a#mostrar_info_concursos").toggle(
		   function() {
			   $("div#oculto").slideDown();
			   $("div#oculto2").slideDown();
			   $("div#oculto3").slideDown();
			   $("div#oculto4").slideDown();
			   $("div#oculto5").slideDown();
			   $("a#mostrar_info_concursos").text("Ver menos informacoes");
		   },
		   function() {
			   $("div#oculto").slideUp();
			   $("div#oculto2").slideUp();
			   $("div#oculto3").slideUp();
			   $("div#oculto4").slideUp();
			   $("div#oculto5").slideUp();
			   $("a#mostrar_info_concursos").text("Ver todas as informacoes");
		   }
	   );
   	});
   	</script>
</h:head>

<h:body>
	<div id="nonFooter">
		<div style="text-align: right;">
			Bem-vindo a sua agenda de concurso, [Nome da pessoa Logada] |
			<h:link value="Sair" />
		</div>
		<div id="wrapper-header">
			<div id="header">
				<div id="wrapper-header2">
					<div id="wrapper-header3"></div>
					<!--wrapper-header3-->
				</div>
				<!--wrapper-header2-->
			</div>
			<!--header-->
		</div>
		<!--wrapper-header-->

		<div id="wrapper-content">
			
			<div id="content">
				<ui:insert name="content">

				</ui:insert>
				<br /> <br />
			</div>
			<!--content-->
		</div>
		<!--wrapper-content-->
	</div>
	<!--nonFooter-->

	<div id="wrapper-footer">
		<div>
			<h:graphicImage styleClass="center" value="/bootstrap/img/rodape.jpg" />
		</div>
	</div>
	<!--wrapper-footer-->
</h:body>
</html>